<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="stylesheet" href="libs/jquery.mobile-1.4.4/jquery.mobile-1.4.4.min.css" />
    <script data-main="js/app" src="libs/requirejs/require.js"></script>

    <style type="text/css">
        @media only screen and (-webkit-min-device-pixel-ratio: 1.0), only screen and ( min--moz-device-pixel-ratio: 1.0), only screen and ( -o-min-device-pixel-ratio: 1.0), only screen and ( min-device-pixel-ratio: 1.0), only screen and (min-resolution: 192dpi) {
            /* Style Rules */
            .infor {
                background: url('images/image/1x/40x40_info.png');
            }

        }

        @media only screen and (-webkit-min-device-pixel-ratio: 2.0), only screen and ( min--moz-device-pixel-ratio: 2.0), only screen and ( -o-min-device-pixel-ratio: 2.0), only screen and ( min-device-pixel-ratio: 2.0), only screen and (min-resolution: 192dpi) {
            /* Style Rules */
            .infor {
                background: url('images/image/2x/80x80_info.png');

            }
        }

        @media only screen and (-webkit-min-device-pixel-ratio: 3.0), only screen and ( min--moz-device-pixel-ratio: 3.0), only screen and ( -o-min-device-pixel-ratio: 3.0), only screen and ( min-device-pixel-ratio: 3.0), only screen and (min-resolution: 192dpi) {
            /* Style Rules */
            .infor {
                background: url('images/image/3x/120x120_info.png');
            }
        }
    </style>
</head>

<body>
    <div data-role="page">
        <div data-role="panel" id="panel_menu" data-position="left" data-display="overlay">
            xxx
        </div>

        <input id="btn_open" type="button" value="open" />
    </div>
</body>
</html>